<template>
<!-- 职位管理 -->
  <div>
    <el-row>
      <el-col :span="24"><div class="grid-content bg-purple-dark">
        <el-button type="primary" @click="AddPositionManagement" style="margin-left:30px; margin-top:15px;">新建职位</el-button>
        </div></el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <div class="grid-content bg-purple-dark_2">
            <el-form :inline="true" :model="form" class="demo-form-inline" label-width="80px" style="padding-top:25px">
              <el-form-item label="初筛人">
                <el-input v-model="form.preliminary" placeholder="简历初筛人"></el-input>
              </el-form-item>
              <el-form-item label="部门">
                <el-select v-model="form.tposition.deptName" placeholder="请选择">
                  <el-option
                    v-for="item in options1"
                    :key="item.deptName"
                    :label="item.deptName"
                    :value="item.deptName">
                  </el-option>
                </el-select>
              </el-form-item>
              &nbsp;&nbsp;
              <el-form-item label="职位性质">
                <el-select v-model="form.tposition.postType" placeholder="职位性质">
                  <el-option label="全部" value=""></el-option>
                  <el-option label="全职" value="0"></el-option>
                  <el-option label="兼职" value="1"></el-option>
                  <el-option label="实习" value="2"></el-option>
                  <el-option label="外派" value="3"></el-option>
                  <el-option label="退休返聘" value="4"></el-option>
                </el-select>
              </el-form-item>
              &nbsp;&nbsp;&nbsp;
               <el-form-item label="学历要求">
                <el-select v-model="form.educational" placeholder="学历要求">
                  <el-option label="全部" value=""></el-option>
                  <el-option label="高中及一下" value="1"></el-option>
                  <el-option label="大专" value="2"></el-option>
                  <el-option label="本科" value="3"></el-option>
                  <el-option label="硕士" value="4"></el-option>
                  <el-option label="博士及以上" value="5"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="发起时间" style="padding-left:10px">
                  <el-date-picker
                    v-model="daterange1"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
                  </el-date-picker>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="pendingList" style="margin-left:550px">搜索</el-button>
                <el-button @click="resetQuery">重置</el-button>
                <el-button @click="handleExport">导出</el-button>
              </el-form-item>
            </el-form>
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <div class="grid-content bg-purple-dark_3">
            <div id="tou">
              <span style=" position: relative;left:100px;top:20px">职位信息</span>
              <span style=" position: relative;left:1000px;top:20px">操作</span>
            </div>
              <br/>
              <br/>
              <div class="tou2"  v-for="(item,index) in positionManage" :key="index">
                  <el-descriptions :colon="false" :column="9" style="margin-left:90px;margin-top:40px;">
                    <el-descriptions-item><span style="font-weight:bold;font-size:16px;">{{item.tposition.positionName}} </span></el-descriptions-item>
                    <el-descriptions-item><span style="color:#909399;">职位ID：{{item.id}}</span></el-descriptions-item>
                  </el-descriptions>
                  <el-descriptions :colon="false" :column="11" style="margin-left:100px;">
                    <el-descriptions-item label="接受简历"><span style="color:blue">6</span></el-descriptions-item>
                    <el-descriptions-item label="初次筛选"><span style="color:blue">6</span></el-descriptions-item>
                    <el-descriptions-item label="待 面 试"><span style="color:blue">6</span></el-descriptions-item>
                    <el-descriptions-item label="面试通过"><span style="color:blue">6</span></el-descriptions-item>
                    <el-descriptions-item label="已发offer"><span style="color:blue">6</span></el-descriptions-item>
                    <el-descriptions-item></el-descriptions-item>
                    <el-descriptions-item></el-descriptions-item>
                    <el-descriptions-item></el-descriptions-item>
                    <el-descriptions-item></el-descriptions-item>
                    <el-descriptions-item>
                      <el-button style=" position: relative;top:-10px"
                         @click="upStatus4(item)"
                         v-if="item.status==2"
                        type="text" >开始招聘
                      </el-button>
                      <el-button style=" position: relative;top:-10px"
                         @click="upStatus3(item)"
                         v-if="item.status==1"
                        type="text" >停止招聘
                      </el-button>
                      
                      <el-button style=" position: relative;top:-10px;left:10px;"
                        @click="findPositionMessageById(item)"
                        type="text" >编辑
                      </el-button>
                      <el-button style=" position: relative;top:-10px;left:10px;"
                        @click="delById(item.id)"
                        type="text" >删除
                      </el-button>
                    </el-descriptions-item>
                  
                  </el-descriptions>
              </div>
              <el-dialog
                title="操作确认"
                :visible.sync="dialogVisible"
                width="30%">
                <span style="font-size:13px;">确定停招当前职位吗？</span>
                <el-form>
                    <el-input v-model="value" style="width:380px;"></el-input>
                </el-form>
                <span slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible = false">取 消</el-button>
                  <el-button type="primary" @click="updateById(entity)">确 定</el-button>
                </span>
              </el-dialog>
              <el-dialog
                title="操作确认"
                :visible.sync="dialogVisible2"
                width="30%">
                <span style="font-size:13px;">确定开始招聘当前职位吗？</span>
                <el-form>
                    <el-input v-model="value" style="width:380px;"></el-input>
                </el-form>
                <span slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible2 = false">取 消</el-button>
                  <el-button type="primary" @click="updateById2(entity)">确 定</el-button>
                </span>
              </el-dialog>
              <el-dialog
                title="操作确认"
                :visible.sync="dialogVisible3"
                width="30%">
                <span style="font-size:16px;">确定删除吗？删除后不可恢复</span>
                <span slot="footer" class="dialog-footer">
                  <el-button @click="dialogVisible3 = false">取 消</el-button>
                  <el-button type="primary" @click="delte(id)">确 定</el-button>
                </span>
              </el-dialog>
              
              <div class="block">
                <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="pageNum"
                  :page-sizes="[3, 10, 20, 50]"
                  :page-size="pageSize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="total"
                >
                </el-pagination>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data() {
    return {
      form: {
        preliminary:"",
        educational:"",
        startDate:"",
        endDate:"",
        tposition:{
          deptName:"",
          postType:"",
        }

      },
      value:"",
      dialogVisible: false,
      dialogVisible2: false,
      dialogVisible3: false,
      positionManage:[],
      options1: [],
      daterange1:[],
      pageNum: 1,
      pageSize: 3,
      total: 0,


      entity:"",
      id:"",
    };
  },
  created() {
    this.getHolidayType();
    this.pendingList();
  },
  methods: {
     AddPositionManagement(){
         this.$router.push("/AddPositionManagement"); //添加
        // this.$router.push("/AddFiles"); //添加
      },
      getHolidayType() { //获取部门
            axios.post("ReplacementCard/findDept")
                .then((res) => {
                    console.log(res);
                    this.options1 = res.data.rows;
                })
      },
      //每页条数改变时触发 选择一页显示多少行
      handleSizeChange(val) {
        this.pageSize = val;
        this.pendingList();
      },
      //当前页改变时触发 跳转其他页
      handleCurrentChange(val) {
        this.pageNum = val;
        this.pendingList();
      },
      pendingList() {
      // var a=JSON.parse(localStorage.getItem("user"))
      // this.voteInfo.sponsorId=a.id
      // console.log("aaa:"+this.voteInfo.sponsorId)
      var dateRange3=this.daterange1.length;
      if (dateRange3> 0) {
          this.form.startDate=this.daterange1[0];
          this.form.endDate=this.daterange1[1];
        }
      axios
        .post(
          "TPositionMessage/findPositionMessageFenYe?pageNum=" +
            this.pageNum +
            "&pageSize=" +
            this.pageSize,
          this.form
        )
        .then((res) => {
          console.log(res);
          this.positionManage = res.data.rows;
          this.total = res.data.total;
        });
    },
     resetQuery(){
      this.form.preliminary="";
      this.form.educational="";
      this.daterange1=[];
      this.form.tposition.deptName="";
      this.form.tposition.postType="";
      this.pendingList();
    },
    updateById(item){
      console.log("修改第一条="+item.id);
      this.dialogVisible=false;
      item.status=2
      axios
      .post("TPositionMessage/updateStatusById", item)
      .then((res) => {
        if (res.data.code == 200) {
          this.$message({
            message: "恭喜你，" + res.data.msg,
            type: "success",
          });
          this.pendingList();
        } else {
          this.$message.error("错了哦，" + res.data.msg);
        }
      });
      this.value="";
    },
    updateById2(item){
      this.dialogVisible2=false;
      item.status=1
      axios
      .post("TPositionMessage/updateStatusById", item)
      .then((res) => {
        if (res.data.code == 200) {
          this.$message({
            message: "恭喜你，" + res.data.msg,
            type: "success",
          });
          this.pendingList();
        } else {
          this.$message.error("错了哦，" + res.data.msg);
        }
      });
      this.value="";
    },
    upStatus4(val){
      this.entity = val;
      this.dialogVisible2 = true;
    },
    upStatus3(val){
      this.entity = val;
      this.dialogVisible = true;
    },
    delById(id){
     this.id=id;
     this.dialogVisible3 = true;
    },
    delte(id){
      this.dialogVisible3 = false;
      axios
          .post("TPositionMessage/delPositionMessageById?id="+id)
          .then((res) => {
            if (res.data.code == 200) {
              this.$message({
                message: "恭喜你，" + res.data.msg,
                type: "success",
              });
              this.pendingList();
            } else {
              this.$message.error("错了哦，" + res.data.msg);
            }
          });
    },
    //跳转到修改页面
      findPositionMessageById(item) {
        this.$router.push({path: '/AddPositionManagement',query:{ id:item.id}})
      },
      handleExport(){
         axios({
          url: "http://localhost:8030/TPositionMessage/getPositionMessageEntity",
          method: "GET",
          responseType: "arraybuffer", // 接收二进制文件流
        }).then((res) => {
          const content = res.data;
          const blob = new Blob([content], { type: "application/octet-stream" });
          const fileName = "export.xlsx";

          if (typeof window.navigator.msSaveBlob !== "undefined") {
            window.navigator.msSaveBlob(blob, fileName);
          } else {
            const fileUrl = window.URL.createObjectURL(blob);
            const a = document.createElement("a");
            a.href = fileUrl;
            a.target = "_blank";
            a.download = fileName;
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
          }
        });
      }
  },
};
</script>

<style scoped>
.block{
  padding-top: 30px;
  padding-left: 800px;
}
 #tou{
  width: 95%;
  height: 60px;
  background-color: rgb(247, 249, 249);
  margin-left: 30px;
  position: relative;
  top:20px;
 }
 .tou2{
  width: 95%;
  height: 110px;
  margin-left: 30px;
 }
 .el-row {
    margin-bottom: 20px;
    
  }
  .el-col {
    border-radius: 4px;
  }
  .bg-purple-dark {
    background: white;
    height: 70px;
  }
   .bg-purple-dark_2 {
    background: white;
    height: 150px;
  }
   .bg-purple-dark_3 {
    background: white;
    height: 700px;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>